import {Fragment} from 'react'
//导入ReactDOM
import ReactDOM  from "react-dom/client";
//导入css样式
import './index.css'
//通过JSX的方式创建React元素
/*
    JSX必须要有一个根节点，而且编译之后在浏览器中不产生跟标签，jsx可以使用如下两种方式完成
    1、使用空标签的方式来完成
    2、Fragment组件来完成
*/
const content=(<>
    <div>姓名:Giles</div>
    <div>
        <img src='https://www.baidu.com/img/flexible/logo/pc/result.png'></img>
    </div>
    <div className='teacher'>
        职业:前端讲师
    </div>
    <div>
        <label htmlFor='name'>姓名:</label>
        <input id="name" placeholder='请输入您的姓名'/>
    </div>
    <div tabIndex="0">蜗牛学苑</div>
    <div>西安蜗牛</div>
    <div tabIndex="1">蜗牛科技</div>
    <div>西安蜗牛科技</div>
    <div tabIndex="2">蜗牛学院</div>
    <div>蜗牛学苑</div>
</>)
const root=ReactDOM.createRoot(document.querySelector('#root'))
root.render(content)